import React from 'react';
import { View, Image, Clipboard } from 'react-native';
import { Lt, Color, Nav, Label, Jpp, Jx, Button, ImagePt, Images, Fimage, Dialog, cSys } from "../_utils";
import { Net, NET_GET, NET_RI } from "../_net"
import { ViewScale } from '../_util';
import { Drawer } from '../_teaset';
import ViewShot from 'react-native-view-shot';
import { ViewShares } from '../ViewShares';
import { cShareInfo } from '../_share';

// 推广赚钱 推广海报
export class Spread extends React.PureComponent{
    constructor(props){
        super(props);

        this.state = {
            image2 : "",
        }
        this.shotRef = null;
        this.info = null;

        // 微信/QQ是否安装
        cSys.checkWechatInstalled();
        cSys.checkQQInstalled();
        // 相机/相册权限
        cSys.promiseCapturePermission(true);

        
        this.onLoadEnd = this.onLoadEnd.bind(this);
        this.onCopy = this.onCopy.bind(this);
        this.onSpread = this.onSpread.bind(this);
    }
    static navigationOptions = {
        ...Nav.options,
        headerTitle: "推广赚钱",
    }
    componentWillMount(){

        Net.request("other/createCode", null, {NET_GET, NET_RI}).then(r=>{
            if(r.data){
                this.setState({image2:r.data});
            }
        });
    }
    onLoadEnd(){
        if(this.state.image2){
            this.info = new cShareInfo();
            this.info.init({
                shotRef : this.shotRef,
                isCapture : true,
                onReady : this.onReady,
            });
        }
    }

    // 复制分享链接
    onCopy(){
        Clipboard.setString(this.state.image2);
        Dialog.toast("已复制到剪贴板");
    }

    onSpread(){
        if(!this.info){
            Dialog.toast("正在生成二维码");
            return;
        }
        Drawer.open(<ViewShares
            showTitle = { true }
            info = { this.info }
        />, "bottom")
    }
    render(){
        const btnHeight = 60;
        const textHeight = 4 * 24;
        const ipt = ImagePt.haibao;
        const height = Jpp.height - Jpp.navHeight - btnHeight - textHeight - Lt.margin * 2;
        const width = height/ipt.r;
        const marginLeft = (Jpp.width - width)/2
        // opacity:0, 安卓5可以 ios不行一片白
        return <View style = {{flex:1, backgroundColor:"white"}}>
            <Nav.StatusBar/>
            <View style={{flex:1}}>
                <View style={{flex:1}}>
                    <Label style={{margin:Lt.margin, fontSize:Lt.c16, color:Color.c3}}>提示：分享海报可以每日赚取积分，好友通过您的邀请海报注册成为海报后，他产生的订单佣金您都有奖励，将自动计入您的账户中！</Label>
                    <ViewScale ipt={ipt} style={{marginLeft, width, height}}>
                        <ViewShot ref={r=>this.shotRef=r}>
                            <Image source={Images.haibao}/>
                            <View style={{position:"absolute", left:80-7, top:275-14-3}}>
                                <Fimage uri={this.state.image2} style={{width:106+14, height:106+14}} onLoadEnd={this.onLoadEnd}/>
                            </View>
                        </ViewShot>
                    </ViewScale>
                </View>
                <View style={{flexDirection:"row"}}>
                    <Button.Pure1 onPress={this.onCopy} title={"复制链接"} style={{backgroundColor:Color.c3, borderRadius:0, width:"50%", height:btnHeight}}/>
                    <Button.Pure1 onPress={this.onSpread} title={"分享海报"} style={{borderRadius:0, width:"50%", height:btnHeight}}/>
                </View>
            </View>
        </View>;
    }
}